const path = require('path')
module.exports={
    entry:'./src/main.js',
    output:{
        //动态获取path的绝对路径
        path:path.resolve(__dirname,'dist'),
        filename:'bundle.js',
        publicPath:'dist/'
    },
    module: {
        rules: [
            //css-loader只负责对css进行加载
            //style-loader负责将css添加到dom
            //use 解析数组元素的时候时从右向作解析
          { test: /\.css$/, use: ['style-loader','css-loader'] },
          {
            test: /\.less$/,
            use: [{
                loader: "style-loader" // creates style nodes from JS strings
            }, {
                loader: "css-loader" // translates CSS into CommonJS
            }, {
                loader: "less-loader" // compiles Less to CSS
            }]
        },{
            test: /\.(png|jpg|gif)$/,
            use: [
              {
                loader: 'url-loader',
                options: {
                    //当加载的图片小于limit时，会把图片变为base64的字符串，
                    // 如果大于limit的话，则需要安装file-loader ,而且需要配置publicPath
                  limit: 1024,
                  name:'img/[name].[hash:8].[ext]'
                },
                
              }
            ]
          },
          //ES6转ES5
          {
            test: /\.js$/,
            exclude: /(node_modules|bower_components)/,
            use: {
              loader: 'babel-loader',
              options: {
                presets: ['es2015']
              }
            }
          }
        ]
      },
    resolve:{
        alias:{
            //指定vue版本，不指定会报错，页面解析不出来
           'vue$':'vue/dist/vue.esm.js' 
        }
    }
}